import 'package:cbec_app/components/base/base_interactive.dart';
import 'package:cbec_app/components/common/common_style.dart';
import 'package:cbec_app/utils/Tools.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
/**
 * 左边是文本，右边是箭头的ITEM
 * 可选参数为otherWidget,可在箭头前方再显示一个组件
 */


class ListItem extends StatelessWidget {

  ///标题
  final String texts;

  ///其他组件【展示在右侧】
  final Widget? ohterWidget;

  ///点击回调
  final VoidCallback ontap;

  ///是否显示右箭头
  final bool? hasIcon;

  const ListItem({super.key, required this.texts, this.ohterWidget, required this.ontap, this.hasIcon=true});

  @override
  Widget build(BuildContext context) {
    return BaseInteractive(
      onClick: ontap,
      childWidget: Container(
        height: 55.w,
        decoration: const BoxDecoration(
        color: Colors.white,
        border: Border(
          bottom: BorderSide(
            color: Color.fromRGBO(243, 245, 247, 1),
            width: 1.0,
          ),
        ),
      ),
      padding: EdgeInsets.all(15.w),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Text(texts,style: setTextStyle(14, FontWeight.w300, Tools.fromHex("#000000"))),
          Row(
            mainAxisAlignment: MainAxisAlignment.end,
            children: [
              ohterWidget != null ? ohterWidget!: const SizedBox(width: 0,),
              ohterWidget != null ? SizedBox(width: 5.w):emptyWidget(),
              hasIcon==true?const Icon(
                Icons.arrow_forward_ios,
                size: 14,
                color: Color.fromRGBO(0, 0, 0, 0.30),
                weight: 700,
              ):emptyWidget()
            ],
          )

        ],
      ),
    ),
    );
  }
}


class ListItem2 extends StatefulWidget {
  ///标题
  final String texts;
  ///其他组件【展示在右侧】
  final Widget? ohterWidget;
  final VoidCallback ontap;
  final bool? hasIcon;

   ListItem2({super.key, required this.texts, required this.ontap,this.ohterWidget, this.hasIcon=true});
  @override
  State<ListItem2> createState() => _ListItemState2();
}

class _ListItemState2 extends State<ListItem2> {
  final TextStyle _titleStyle =  TextStyle(
      fontSize: 14.0,
      color: Color.fromRGBO(0, 0, 0, 0.90),
      fontWeight: FontWeight.w300);
  

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: const BoxDecoration(
        color: Colors.white,
        border: Border(
          bottom: BorderSide(
            color: Color.fromRGBO(243, 245, 247, 1),
            width: 1.0,
          ),
        ),
      ),
      padding:  EdgeInsets.all(5.w),
      child: ListTile(
        leading: Text(
          widget.texts,
          style: _titleStyle,
        ),
        trailing: Container(
          alignment: Alignment.centerRight,
          width: 200.w,
          // color: Colors.red,
            child: Row(
              mainAxisAlignment: MainAxisAlignment.end,
          children: [
            // Visibility(visible: is_visible,child: widget.ohterWidget),
            widget.ohterWidget != null ? widget.ohterWidget!: const SizedBox(width: 0,),
             SizedBox(width: 5.w,),//间距
             widget.hasIcon!=false ?
             const Icon(
              Icons.arrow_forward_ios,
              size: 14,
              color: Color.fromRGBO(0, 0, 0, 0.30),
              weight: 700,
            ):SizedBox(),
          ],
        ),
        ),
        onTap: widget.ontap,
      ),
    );
  }
}